<script setup>
const passage = {
  title: "<span>欢迎使用FMS 1.0系统！</span>",
  graphs: [
    {
      title: "<span>一、使用说明</span>",
      body: "<div>点击左侧导航栏展开多级菜单，以选择所需的功能。</div>" +
          "<div>如使用收支平衡统计：点击账目管理 -> 点击收支平衡统计选项</div>" +
          "<div>您可以随时通过点击左上角的Logo（财务管理系统 FMS）回到这个页面。</div>"
    },
    {
      title: "<span>二、版本说明 v1.0</span>",
      body: "<div>1）目前已完成前端界面开发，支持报表展示，财务审核可视化。</div>" +
          "<div>2）目前已初步搭建基于Spring的后端服务体系，支持Excel数据导入与导出，以及完成相关计算</div>" +
          "<div>3）已提供完整的收支平衡统计功能</div>"
    }
  ]
}
</script>

<template>
  <div class="main-body">
    <div class="passage-title" v-html="passage.title"></div>
    <div class="passage-graphs" v-for="graph in passage.graphs">
      <div class="graph-title" v-html="graph.title"></div>
      <div class="graph-body" v-html="graph.body"></div>
    </div>
    <el-divider/>
    <div class="passage-title">快速访问</div>
    <div class="passage-graphs">
      <div class="graph-body">
        <router-link to="/accounting-balance">-> 住宿收支统计</router-link>
      </div>
    </div>
  </div>
</template>